<!--
    group: 发票管理
    name: 开票列表
    item: 结算---（展示本季度所有发票数据弹层）
-->
<template>
  <a-modal
    :width="config.width"
    :footer="null"
    :title="config.modalTitle"
    :destroyOnClose="true"
    v-model="config.visible"
  >
    <div class="estimated">
      <h5>请确认开票费用！</h5>

      <h4 class="mTop">本次开票金额</h4>
      <a-table
        bordered  size="small"
        :loading="currentlyLoading"
        :rowKey="row => row.id"
        :row-selection="rowSelection"
        :columns="currentlyColumns"
        :data-source="currentlyData"
        :scroll="{y: 300}"
        :pagination="false"
      >
        <!--发票类型 1-专票 2-普票-->
        <span slot="taxType" slot-scope="text,record">
            <span v-if="text" :class="text === 1 ? 'd' : 'c'" style="margin-right: 5px">
              {{{1:'专票',2:'普票'}[text] || ''}}
            </span>
          </span>

        <template slot="footer" slot-scope="currentPageData">
          合计： <span style="float: right;">{{ notCost.chargeInfoTotal }}元</span>
        </template>

      </a-table>


      <h4 class="mTop">本季度受影响发票订单</h4>
      <a-table
        bordered  size="small"
        :loading="currentlyLoading"
        :columns="historyColumns"
        :data-source="historyData"
        :scroll="{x: 400,y: 300}"
        :pagination="false"
      >
        <!-- 发票类型 1-专票 2-普票 -->
        <span slot="taxType" slot-scope="text,record">
          <span v-if="text" :class="text === 1 ? 'd' : 'c'" style="margin-right: 5px">
            {{{1:'专票',2:'普票'}[text] || ''}}
          </span>
        </span>

        <template slot="footer" slot-scope="currentPageData">
          <div style="display: flex;">
            <span style="white-space: nowrap;">合计：</span>
            <a-row style="width:100%;">
              <a-col :span="16" style="text-align: right;">
                <span class="orange">应补费用：{{ notCost.additionalTaxMoneyDiff }}元</span>
              </a-col>
              <a-col :span="8" style="text-align: right;">
                <span class="red">减免费用：{{ notCost.serviceChargeMoneyDiff }}元</span>
              </a-col>
            </a-row>
          </div>
        </template>

      </a-table>

      <div class="flex">
        预计应缴费用合计：
        <span class="orange">{{ notCost.allTotal }}元</span>
      </div>
      <p v-if="historyData.length > 0" class="red tips">减免费用<span style="font-weight: bold;"> {{ notCost.newDiffTotal }}元 </span>将在您完成本次订单支付后，原路退回您的支付账户中！</p>
    </div>

    <div class="desc_btn">
      <a-button :disabled="currentlyLoading" @click="orderGenerate" type="primary" class="btnsLarge" v-preventReClick>生成订单</a-button>
      <a v-if="config.category || config.pendingOrders == 1 || (config.mark == 1 && config.pendingOrders == 1)" class="mLeft" @click="back">返回上一步</a>
    </div>
  </a-modal>
</template>

<script>
import { cloneObject, conversionElement } from '@/utils/util'
import { calculatingBanchExpenses } from '@api/invoiceAdminister'

export default {
  name: 'invoiceBatchSettlement',
  props: ['config','checkList'],
  data(){
    return{
      // config: {
      //   width: '850px',
      //   visible: false,
      //   ladderStatus: 1, //1-未跨阶梯  2-跨阶梯
      //   pendingOrders: 1, //1-有待支付订单  2-无待支付订单
      //   category: 'cnd',    //类别  cnd-超470万  sd-超数电月限额  czs-超征收限额  cfwms-超服务模式限额
      //   source: 3, //3-单笔结算  4-批量结算
      // },

      notCost: {},  //金额对象

      //本次费用
      currentlyLoading: false,
      currentlyData: [],
      currentlyColumns: [
        {
          title: '发票类型',
          dataIndex: 'taxType',
          width: 100,
          scopedSlots: {customRender: 'taxType'},
          align: 'center'
        },
        {
          title: '开票金额',
          dataIndex: 'amount',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 120,
          align: 'center'
        },
        {
          title: '应缴个税',
          dataIndex: 'personalTaxMoney',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 100,
          align: 'center'
        },
        {
          title: '应缴增值税',
          dataIndex: 'vatMoney',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 100,
          align: 'center'
        },
        {
          title: '应缴附加税',
          dataIndex: 'additionalTaxMoney',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 100,
          align: 'center'
        },
        {
          title: '开票服务费',
          dataIndex: 'serviceChargeMoney',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 100,
          align: 'center'
        },
      ],

      //历史费用
      historyData: [],
      historyColumns: [
        {
          title: ' ',
          dataIndex: 'invoiceName',
          width: 70,
          align: 'center'
        },
        {
          title: '发票类型',
          dataIndex: 'taxType',
          width: 100,
          scopedSlots: {customRender: 'taxType'},
          align: 'center'
        },
        {
          title: '开票金额',
          dataIndex: 'amount',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 120,
          align: 'center'
        },
        // {
        //   title: '应缴个税',
        //   dataIndex: 'personalTaxMoney',
        //   customRender: (text,record) => {
        //     if (text != null){
        //       return Math.round(text * 100)/10000 + '元'
        //     }else {
        //       return '-'
        //     }
        //   },
        //   width: 120,
        //   align: 'center'
        // },
        {
          title: '应缴增值税',
          dataIndex: 'vatMoney',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 120,
          align: 'center'
        },
        // {
        //   title: '增值税差额',
        //   dataIndex: 'vatMoneyDiff',
        //   customRender: (text,record) => {
        //     if (text != null){
        //       return Math.round(text * 100)/10000 + '元'
        //     }else {
        //       return '-'
        //     }
        //   },
        //   width: 120,
        //   align: 'center'
        // },
        {
          title: '应缴附加税',
          dataIndex: 'additionalTaxMoney',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 120,
          align: 'center'
        },
        // {
        //   title: '附加税差额',
        //   dataIndex: 'additionalTaxMoneyDiff',
        //   customRender: (text,record) => {
        //     if (text != null){
        //       return Math.round(text * 100)/10000 + '元'
        //     }else {
        //       return '-'
        //     }
        //   },
        //   width: 120,
        //   align: 'center'
        // },
        // {
        //   title: '开票服务费',
        //   dataIndex: 'serviceChargeMoney',
        //   customRender: (text,record) => {
        //     if (text != null){
        //       return Math.round(text * 100)/10000 + '元'
        //     }else {
        //       return '-'
        //     }
        //   },
        //   width: 120,
        //   align: 'center'
        // },
        {
          title: '减免个税',
          dataIndex: 'personalTaxMoneyDiff',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 120,
          align: 'center'
        },
        {
          title: '减免服务费',
          dataIndex: 'serviceChargeMoneyDiff',
          customRender: (text,record) => {
            if (text != null){
              return Math.round(text * 100)/10000 + '元'
            }else {
              return '-'
            }
          },
          width: 120,
          align: 'center'
        },
      ],

      //初始选中数组
      checkNewList: [],
      selectedRowKeys: [],

    }
  },
  watch:{
    'checkList': {
      handler(val){
        // console.log('777确认费用checkList==>',val)
        if (val && val.length > 0){
          this.checkNewList = cloneObject(val);
          this.selectedRowKeys = this.checkNewList.map(item => item.id);
        }
      },
      deep: true,
      immediate: false,  //初始值执行函数
    },
    'config': {
      handler(val){
        // console.log('888invoiceBatchSettlement页面',val)
        if (val.visible){
          this.calculatExpenses(this.checkNewList);
        }
      },
      deep: true,
      immediate: false,  //初始值执行函数
    },
  },
  computed: {
    rowSelection() {
      return {
        onChange: (selectedRowKeys, selectedRows) => {
          this.selectedRowKeys = selectedRowKeys;

          // 在这里可以根据selectedRows更新其他数据属性值
          this.updateDataProperty(selectedRows);
        },
        getCheckboxProps: record => {
          return {
            props: {
              defaultChecked: record.checkShow == true,
              disabled: this.config.source == 3
            }
          };
        },
      };
    },
  },
  methods: {
    //返回上一步
    back(){
      this.$parent.backLimitCancle(this.config);
    },
    //生成订单
    orderGenerate(){
      if (this.selectedRowKeys.length > 0){
        this.config.payIdList = this.selectedRowKeys;    //赋值订单id跳转支付需要
        //子组件调用父组件方法
        this.$emit('batchMethod',this.config);
      }else {
        this.$message.warning('请至少选择一项生成订单');
      }
    },
    //更新其他数据属性值---checkShow
    updateDataProperty(list){
      let newList = [];
      newList = this.checkNewList;

      if (list.length > 0){
        //checkNewList  比对原数组和选中数组的id值 相同的赋值true
        for (let obj1 of newList) {
          for (let obj2 of list) {
            if (obj1.id == obj2.id) {
              // 假设我们想要更新name属性为value属性
              obj1.checkShow = true;
              break
            }else{
              obj1.checkShow = false;
            }
          }
        }

        //重新请求预计算接口
        this.calculatExpenses(newList);

      }else{
        this.notCost.chargeInfoTotal = 0;
        this.notCost.allTotal = 0;
      }
    },
    //预计算费用
    calculatExpenses(params){
      this.currentlyLoading = true;
      calculatingBanchExpenses(params).then(res => {
        if (res.success) {
          if (res.result){
            this.currentlyLoading = false;
            let data = cloneObject(res.result.entChargeInfoVOS[0]);

            //处理发票金额
            this.notCost.allTotal = conversionElement(data.allTotal);  //预计应缴费用
            this.notCost.chargeInfoTotal = conversionElement(data.chargeInfoTotal);  //本次费用合计

            this.currentlyData = data.chargeInfoList || [];  //本次费用列表

            //历史费用列表
            if (data.chargeInfoDiffList.length > 0 && data.chargeInfoDiffTotal){
              let arrList = data.chargeInfoDiffList || [];
              this.historyData = arrList;
              this.notCost.additionalTaxMoneyDiff = conversionElement(data.chargeInfoDiffTotal.additionalTaxMoneyDiff);  //应缴增值税附加税总和
              this.notCost.serviceChargeMoneyDiff = conversionElement(data.chargeInfoDiffTotal.serviceChargeMoneyDiff);  //减免个税服务费总和
              this.notCost.newDiffTotal = Math.abs(this.notCost.serviceChargeMoneyDiff);  //减免费用
            }else {
              this.historyData = [];
            }

          }
        }else{
          this.$message.warning(res.message);
        }
      })
    }
  }
}
</script>

<style scoped lang="less">
.mTop{
  margin-top: 30px;
}
.estimated{
  width: 100%;
  h5{
    font-weight: bolder;
    font-size: 16px;
  }
}

.flex{
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}
.tips{
  margin-top: 15px;
  font-size: 12px;
  text-align: right;
}


.desc_btn{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  margin: 40px 0 20px 0;
  text-align: center;
}
.desc_btn a{
  margin-left: 10px;
  //text-decoration: underline;
}
</style>
